<!DOCTYPE html>
<html>
<head>
<script src="../../../resources/js-test.js"></script>
</head>
<body>
<script>
description('Test for spinbutton behavior for out-of-range values.');

var parent = document.createElement('div');
document.body.appendChild(parent);
parent.innerHTML = '<input type=number id=lower value=-10 min=0 max=100>'
    + '<input type=number id=higher value=200 min=0 max=100>';
var lower = document.getElementById('lower');
var higher = document.getElementById('higher');

function sendKeyEvent(element, key)
{
    element.focus();
    eventSender.keyDown(key);
}

debug('Pressing the down arrow key on an input field of which value is lower than the minimum:');
sendKeyEvent(lower, 'ArrowDown');
var unchanged = "-10";
shouldBe('lower.value', 'unchanged');

debug('Pressing the up arrow key on the input:');
sendKeyEvent(lower, 'ArrowUp');
shouldBe('lower.value', 'lower.min');

debug('Pressing the up arrow key on an input field of which value is higher than the maximum:');
sendKeyEvent(higher, 'ArrowUp');
unchanged = "200";
shouldBe('higher.value', 'unchanged');

debug('Pressing the down arrow key on the input:');
sendKeyEvent(higher, 'ArrowDown');
shouldBe('higher.value', 'higher.max');

parent.innerHTML = '';
</script>
</body>
</html>
